﻿
@using Microsoft.AspNet.Identity
@model IEnumerable<QBWeb.Models.CurriculumFolder.Curriculum>

@{
    ViewBag.Title = "Index";
}



<br/>
<p><a href="~/Home/Index">主页</a>> 课程中心</p>
<span id="UserId" hidden="hidden" >@User.Identity.GetUserId()</span>
<h2>课程中心</h2>


<div class="row" style="margin-top: 20px;background: white;height: 100%" >
    <div class="col-md-12" >
        <div class="layui-tab layui-tab-brief" lay-filter="docTab">
            <ul class="layui-tab-title">
                <li class="layui-this">我的课程</li>
                <li>加入课程</li>
            </ul>
            <div class="layui-tab-content layui-show" >
                <!--》OCCUPATION《-->
            </div>
        </div>
    </div>
</div>


<script>
    $(document).ready(function () { //首次加载页面0
        activeAjax(0);
    });
    //注意：选项卡 依赖 element 模块，否则无法进行功能性操作
    layui.use(['element', 'layer'],
        function () {
            var element = layui.element, layer = layui.layer;

            element.on('tab(docTab)',
                function (ele) {
                    var a = ele.index;
                    activeAjax(a);
                });
        });

    function activeAjax(index) {
        const loadingGif = `<p style="text-align: center">
                <i class="layui-icon layui-anim layui-anim-rotate layui-anim-loop" style="font-size: 50px; color: lightgray">&#xe63e;</i>
            </p>`;
        $(".layui-tab-content").empty();
        $(".layui-tab-content").append(loadingGif);

        $.ajax({
            type: "POST",
            url: "/Curricula/ReturnStuCard",
            data: { cardIndex: index },
            dataType: "HTML",
            success: function (data) {

                setTimeout(function() {
                    $(".layui-tab-content").empty();
                    $(".layui-tab-content").append(data);
                },200);
            },error: function () {
                layer.msg("服务器连接失败");
                setTimeout(function () {
                    $(".layui-tab-content").empty();
                }, 1000);

            }
        });
    }
</script>

